import React from 'react';
import Screen from '../Base/Screen';
import {withRouter} from "react-router-dom";
import {connect} from "react-redux";
import Immutable from "immutable";

class UserOverlay extends Screen {

    render = () => (
        <div className="clearfix header-drop-list">
            <div className="clearfix header-drop-tit">
                <div className="nav-tit fl">
                    订单提示
                </div>
            </div>
            <ul className="clearfix header-drop02-info">
                {
                    this.props.messages.map((item,index)=>(
                        <li key={index}><a href="javascript:;">{Message[item.get('action')]['title']}</a><span>(<span className="main-color">{item.get('data',Immutable.fromJS([])).size}</span>)</span></li>
                    ))
                }
            </ul>
        </div>
    )
}

export default withRouter(connect(state => ({
    collapsed: state.root.app.get('collapsed'),
    messages: state.root.app.get('messages',Immutable.fromJS([])),
    user: state.root.user,
}))(UserOverlay));
